<template>
  <starModal :ref="ref" :config="config" @click="click">
    <editView :data="dataSet.formData"></editView>
  </starModal>
</template>

<script>
const ref = "editModal";
export default {
  name: ref,
  inject: ["anc"],
  data() {
    return {
      ref,
      show: false,
      width: 600,
      loading: false,
      config: {
        title: "编辑",
        show: false,
        width: 0,
        height: 400,
        draggable: true,
        mask: true,
        closable: true,
        okText: "确定",
        cancelText: "取消",
        widthRatio: 0.5,
      },
    };
  },
  props: {
    dataSet: {
      default: () => {
        return {};
      },
    },
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {
    this.$nextTick(() => {
      this.$set(this.anc.vms, this.ref, this);
      const obs = new ResizeObserver((entries) => {
        this.width = entries[0].contentRect.width * this.config.widthRatio;
      });
      obs.observe(this.$el);
    });
  },
  methods: {
    click(btn) {
      if (btn.text == "确定") {
        btn.loading = true;
        this.config.loading = true;
        this.anc.editModalOk(btn);
      } else {
        this.$set(this.config, "show", false);
      }
      this.config.loading = false;
    },
  },
};
</script>
<style scoped lang="scss">
$top: 40px;
.content {
  position: relative;
  width: 100%;
  height: 70vh;
  overflow-x: hidden;
  overflow-y: auto;
}
</style>
